/**
 * 导航条item --如一个设置按钮
 * Name:chentao
 * Date:2017-11-20
 */
import React, { PureComponent } from 'react';
import {
    View,
    Text,
    StyleSheet,
    TouchableOpacity,
    Image
} from 'react-native';


class NavigationItem extends PureComponent {
    render() {
        let icon = this.props.icon &&
            <Image resizeMode={'contain'} style={[styles.icon, this.props.iconStyle]} source={this.props.icon} />;

        let title = this.props.title &&
            <Text style={[styles.title, this.props.titleStyle]}>{this.props.title}</Text>;
        return (
            <TouchableOpacity style={[styles.container,this.props.style]} onPress={this.props.onPress}>
                {icon}
                {title}
            </TouchableOpacity>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex:1,
        // flexDirection: 'row',
        justifyContent: 'center',
        alignItems: 'center',
        // backgroundColor:'#ee2233'
    },
    icon: {
        width: 20,
        height: 20,
        marginLeft: 12,
    },
    title: {
        fontSize: 15,
        color: '#333333',
        margin: 8,
    }
});

export default NavigationItem;